<!DOCTYPE HTML>
<html>
<head>
<title>movies</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css"
	media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/profile-profile.13d06bf4.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="js/box.js"></script>
<script src="js/qrcode.js"></script>
<script type="application/x-javascript">
	
	
	
	
			addEventListener("load", function() {
				setTimeout(hideURLbar, 0);
			}, false);

			function hideURLbar() {
				window.scrollTo(0, 1);
			}
		



</script>
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<link rel="stylesheet" href="css/flexslider.css" type="text/css"
	media="screen" />
<link href="css/megamenu.css" rel="stylesheet" type="text/css"
	media="all" />
<script type="text/javascript" src="js/megamenu.js"></script>
<script>
	$(document).ready(function() {
		$(".megamenu").megamenu();
	});
</script>
<script src="js/menu_jquery.js"></script>
<link rel="stylesheet" href="css/etalage.css">
<script src="js/jquery.easydropdown.js"></script>
<script src="js/jquery.etalage.min.js"></script>
<script>
	jQuery(document)
			.ready(
					function($) {

						$('#etalage')
								.etalage(
										{
											thumb_image_width : 300,
											thumb_image_height : 400,
											source_image_width : 900,
											source_image_height : 1200,
											show_hint : true,
											click_callback : function(
													image_anchor, instance_id) {
												alert('Callback example:\nYou clicked on an image with the anchor: "'
														+ image_anchor
														+ '"\n(in Etalage instance: "'
														+ instance_id + '")');
											}
										});

					});
</script>

<script type="text/javascript" src="js/jquery.jscrollpane.min.js"></script>
<script type="text/javascript" id="sourcecode">
	$(function() {
		$('.scroll-pane').jScrollPane();
	});
</script>
<script type="text/javascript">
	$(function() {
		getUser();
	});
	function createCode(text){
		new QRCode(document.getElementById('qrcode'), text);
	}
	function oper(state,watchTime){
		if(state=="未支付"){
			
		}else if(state=="未取票"){
			/* var oper = "取票"+'<a href="javascript:void(0)" style="background-color: green;" class="pay-btn" data-act="orders-pay-click" data-bid="b_d2ll8ybm">改签</a>'; */
			showAddBox();
			var text = new Date().getTime();
			createCode(text+"");
			$("#codeNum").html(text);
			$("#watchTime").html(watchTime);
		}
	}
	function getUser() {
		$.ajax({
			url:"user/getUser",
			type:"get",
			success:function(data){
				if(data!=""){
					$("#userLogin").css("display","none");
					$("#userMessage").css("display","block");
					var content = '<a href="info.html">'
						+'<img alt="" src="'+data.uimg+'" height="40px" style="border-radius: 50%;">&nbsp'
						+'<span style="color:black;" id="uname">'+data.uname+'</span>&nbsp&nbsp'
						+'</a>'
						+'<button type="button" class="btn btn-info" onclick="logout()" style="">注销</button>';
					$("#userMessage").html(content);
					$("#account").val(data.account);
					$("#uid").val(data.uid);
				}else{
					$("#userLogin").css("display","block");
					$("#userMessage").css("display","none");
					$("#account").val("");
					$("#uid").val("");
				}
				showUserInfo();
			}
		});
	}
	function logout(){
		$.ajax({
			url:"user/logout",
			type:"get",
			success:function(data){
				getUser();
			}
		});
	}
	function showUserInfo() {
		var account = $("#account").val();
		$("#orderInfo").css("display", "none");
		$("#userInfo").css("display", "block");
		if(account!=""){
			$.ajax({
				url : "user/showUserInfo",
				type : "post",
				data : {
					account : account
				},
				success : function(data) {
					if (data.userState == "单身") {
						$("#single").prop("checked", true);
					} else if(data.userState == "热恋中"){
						$("#love").prop("checked", true);
					} else if(data.userState == "已婚"){
						$("#marry").prop("checked", true);
					} else if(data.userState == "为人父母"){
						$("#parent").prop("checked", true);
					}
					if (data.sex == "男") {
						$("#male").prop("checked", true);
					} else {
						$("#female").prop("checked", true);
					}
					$("#username").val(data.uname);
					$("#year").val(data.year);
					$("#month").val(data.month);
					$("#date").val(data.date);
					$("#vlevel").html(data.vip.vlevel);
					$("#vdiscount").html(data.vip.vdiscount);
					$("#message").val(data.message);
					$("#uid").val(data.uid);
					$("#userJob").val(data.userJob);
				}
			});
		}else{
			location.href="index.html";
		}
	}
	function showOrder() {
		var uid = $("#uid").val();
		$("#infoTitle").html("我的订单");
		$("#userInfo").css("display", "none");
		$("#orderInfo").css("display", "block");
		if(uid!=""){
			$.ajax({
				url:"order/showOrder",
				type:"post",
				data:{
					uid:uid
				},
				success:function(data){
					var content = "";
					for(var i=0;i<data.length;i++){
						if(data[i].orderState=="已支付" || data[i].orderState=="已取消" || data[i].orderState=="已退款"){
							var oper = "已完成";
						}else if(data[i].orderState=="未支付"){
							var oper = "付款";
						}else if(data[i].orderState=="未取票"){
							/* var oper = "取票"+'<a href="javascript:void(0)" style="background-color: green;" class="pay-btn" data-act="orders-pay-click" data-bid="b_d2ll8ybm">改签</a>'; */
							var oper = "取票";
						}
						var seats=JSON.parse(data[i].selectedSets);
						var scontent = "";
						for(var j=0;j<seats.length;j++){
							scontent+='<span>'+(seats[j][0]+1)+'排'+(seats[j][1]+1)+'座</span>';
						}
						content += '<div class="order-box" data-orderid="21359178002">'
						+'<div class="order-header">'
						+'<span class="order-date">'+data[i].oDate+'</span>订单号:<span class="order-id">'+data[i].onum+'</span>'
						+'<span class="del-order" data-orderid="21359178002" style="cursor: pointer;" onclick="delOrder('+data[i].oid+')"></span>'
						+'</div>'
						+'<div class="order-body">'
						+'<div class="poster" style:"width:82px;">'
						+'<img src="'+data[i].movieImgs[0].mimg+'">'
						+'</div>'
						+'<div class="order-content">'
						+'<div class="movie-name">'+data[i].movieName+'</div>'
						+'<div class="cinema-name">'+data[i].cinemaName+'</div>'
						+'<div class="hall-ticket">'
						+'<span>'+data[i].hallName+'</span>'
						+'<span>'+scontent+'</span>'
						+'</div>'
						+'<div class="show-time">'+data[i].startTime+'</div>'
						+'</div>'
						+'<div class="order-price">￥<span>'+data[i].oprice+'</span></div>'
						+'<div class="order-status">'+data[i].orderState+'</div>'
						+'<div class="actions">'
						+'<div>'
						+'<a href="javascript:void(0)" class="pay-btn" data-act="orders-pay-click" data-bid="b_d2ll8ybm" onclick="oper(\''+data[i].orderState+'\',\''+data[i].watchTime+'\')">'+oper+'</a>'
						+'</div>'
						+'</div>'
						+'</div>'
						+'</div>';
					}
					$("#orderInfo").html(content);
				}
			});
		}else{
			location.href="index.html";
		}
	}
	function delOrder(oid){
		$.ajax({
			url:"order/delOrder",
			type:"post",
			data:{
				oid:oid
			},
			success:function(data){
				showOrder();
			}
		});
	}
	function updateUser(){
		var account = $("#account").val();
		$.ajax({
			url:"user/updateUser",
			type:"post",
			data:{
				account:account,
				uname:$("#uname").val(),
				sex:$("input[name='gender']:checked").val(),
				birth:$("#year").val()+'-'+$("#month").val()+'-'+$("#date").val(),
				message:$("#message").val(),
				userState:$("input[name='state']:checked").val(),
				userJob:$("#userJob").val()
			},
			success:function(data){
				if(data>0){
					alert("修改成功！")
					showUserInfo();
				}
			}
		});
	}
</script>
</head>
<body>
	<input type="hidden" id="i" value="0">
	<input type="hidden" id="account">
	<input type="hidden" id="uid">
	<!-- header -->
	<div style="height: 100px;">
		<div style="position: fixed; width: 100%; z-index: 999;">
			<div class="header">
				<div class="top_bg" style="background-color: white;">
					<div class="container">
						<div class="header_top">
							<div class="logo">
								<a href="index.html"><img src="images/logo.png" alt="" />蜗牛影院</a>
							</div>
							<div class="top_right" style="margin-top: 0">
								<div id="userMessage" style="line-height: 45px;display: none;">
								<!-- <a href="info.html"><img alt="" src="images/aimg.jpg" height="40px" style="border-radius: 50%;" id="uimg">&nbsp<span style="color:black;" id="uname">1823342352323</span></a> -->
							</div>
							<ul id="userLogin" style="line-height: 45px;display: none;">
									<li><a href="registration.html"><button type="button"
												class="btn btn-info">注册</button></a></li>|
									<li class="login">
										<div id="loginContainer">
											<a href="#" id="loginButton"><button type="button"
													class="btn btn-info">登陆</button></a>
											<div id="loginBox">
												<form id="loginForm">
													<fieldset id="body">
														<fieldset>
															<label for="email">账号</label> <input type="text"
																name="email" id="email">
														</fieldset>
														<fieldset>
															<label for="password">密码</label> <input type="password"
																name="password" id="password">
														</fieldset>
														<input type="submit" id="login" value="登陆"> <label
															for="checkbox"><input type="checkbox"
															id="checkbox"> <i>记住我</i></label>
													</fieldset>
													<span><a href="#">密码忘记了?</a></span>
												</form>
											</div>
										</div>
									</li>
								</ul>
							</div>
							<div class="clearfix"></div>
						</div>
					</div>
				</div>
			</div>
			<div class="head-bann">
				<div class="container">
					<div class="head-nav">
						<span class="menu"> </span>
						<ul class="megamenu skyblue">
							<li><a class="color1" href="index.html">首页</a></li>
							<li class="grid"><a class="color2" href="movies.html">影片</a></li>
							<li><a class="color4" href="cinema.html?mid=1">影院</a></li>
							<li><a class="color5" href="comment.html">评论</a></li>
							<div class="clearfix"></div>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- script-for-nav -->
	<script>
		$("span.menu").click(function() {
			$(".head-nav ul").slideToggle(300, function() {
				// Animation complete.
			});
		});
	</script>
	<!-- script-for-nav -->

	<div class="banner1">
		<div class="container"></div>
	</div>
	<!-- header -->
	<!-- content -->
	<div class="container">
		<div class="women_main">
			<div class="col-md-3 span_1_of_right">
				<section class="sky-form">
					<div class="product_right">
						<h3 class="m_2">个人中心</h3>
						<table class="table table-striped table-hover"
							style="margin-bottom: 0;">
							<tbody style="text-align: center; font-size: 1.3em;">
								<tr>
									<td><a href="javascript:void(0)" onclick="showUserInfo()">基本信息</a></td>
								</tr>
								<tr>
									<td><a href="javascript:void(0)" onclick="showOrder()">我的订单</a></td>
								</tr>
							</tbody>
						</table>
					</div>
				</section>
			</div>
			<div class="col-md-9 w_content">
				<div class="women">
					<a href="javascript:void(0)" onclick="info.html">
						<p style="font-size: 1.5em; color: red" id="infoTitle">基本信息</p>
					</a>
					<div class="clearfix"></div>
				</div>
				<div class="grids_of_4" id="userInfo">
					<div class="col-md-5" style="font-size: 1.2em;">
						<div style="margin-top: 1.5em; text-align: center;">
							<img alt="" src="images/pic.jpg" width="80%">
						</div>
						<div style="margin-top: 1.5em; text-align: center;">
							<button type="button" class="btn btn-danger">更换头像</button>
						</div>
						<div style="margin-top: 1.5em; text-align: center;">
							<p style="color: red">支持JPG,JPEG,PNG格式,且文件需小于1M</p>
						</div>
					</div>
					<div class="col-md-7" style="font-size: 1.2em;">
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp昵称：</span>&nbsp<input
									type="text" placeholder="2-15个字，支持中英文、数字"
									style="width: 50%; font-size: 0.8em; height: 2.3em;" id="username">
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp性别：</span>&nbsp<input
									type="radio" name="gender" value="男" checked="checked"
									id="male">男&nbsp&nbsp&nbsp<input type="radio"
									name="gender" value="女" id="female">女
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp生日：</span> <select
									id="year">
									<option>2019</option>
									<option>2018</option>
									<option>2017</option>
									<option>2016</option>
									<option>2015</option>
									<option>2014</option>
									<option>2013</option>
									<option>2012</option>
									<option>2011</option>
									<option>2010</option>
									<option>2009</option>
									<option>2008</option>
									<option>2007</option>
									<option>2006</option>
									<option>2005</option>
									<option>2004</option>
									<option>2003</option>
									<option>2002</option>
									<option>2001</option>
									<option>2000</option>
									<option>1999</option>
									<option>1998</option>
									<option>1997</option>
									<option>1996</option>
									<option>1995</option>
									<option>1994</option>
									<option>1993</option>
									<option>1992</option>
									<option>1991</option>
									<option>1990</option>
								</select>&nbsp年 <select id="month">
									<option>1</option>
									<option>2</option>
									<option>3</option>
									<option>4</option>
									<option>5</option>
									<option>6</option>
									<option>7</option>
									<option>8</option>
									<option>9</option>
									<option>10</option>
									<option>11</option>
									<option>12</option>
								</select>&nbsp月 <select id="date">
									<option>1</option>
									<option>2</option>
									<option>3</option>
									<option>4</option>
									<option>5</option>
									<option>6</option>
									<option>7</option>
									<option>8</option>
									<option>9</option>
									<option>10</option>
									<option>11</option>
									<option>12</option>
									<option>13</option>
									<option>14</option>
									<option>15</option>
									<option>16</option>
									<option>17</option>
									<option>18</option>
									<option>19</option>
									<option>20</option>
									<option>21</option>
									<option>22</option>
									<option>23</option>
									<option>24</option>
									<option>25</option>
									<option>26</option>
									<option>27</option>
									<option>28</option>
									<option>29</option>
									<option>30</option>
									<option>31</option>
								</select>&nbsp日
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>会员等级：</span> <span id="vlevel">非会员</span>
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>会员折扣：</span> <span id="vdiscount">1</span>
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;" id="userState">
							<p><span>生活状态：</span>
								<input type="radio" name="state" value="单身" id="single" checked="checked">单身&nbsp&nbsp&nbsp
								<input type="radio" name="state" value="热恋中" id="love">热恋中&nbsp&nbsp&nbsp
								<input type="radio" name="state" value="已婚" id="marry">已婚&nbsp&nbsp&nbsp
								<input type="radio" name="state" value="为人父母" id="parent">为人父母&nbsp&nbsp&nbsp
							</p>
						</div>
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p><span>从事行业：</span>
							<select id="userJob">
								<option>-----</option>
								<option>信息技术</option>
								<option>金融保险</option>
								<option>商业服务</option>
								<option>建筑地产</option>
								<option>工程制造</option>
								<option>交通运输</option>
								<option>文化传媒</option>
								<option>娱乐体育</option>
								<option>公共事业</option>
								<option>学生</option>
								<option>其他</option>
							</select>
							</p>
						</div>
						<!-- <div style="margin-top: 1.5em; margin-left: 1.5em;">
							<div style="float: left;">兴趣爱好：</div>
							<div style="float: left;">
								<input type="checkbox" name="interest">&nbsp美食 <input
									type="checkbox" name="interest">&nbsp动漫 <input
									type="checkbox" name="interest">&nbsp摄影 <input
									type="checkbox" name="interest">&nbsp电影 <input
									type="checkbox" name="interest">&nbsp体育<br> <input
									type="checkbox" name="interest" style="margin-top: 1em;">&nbsp财经
								<input type="checkbox" name="interest">&nbsp音乐 <input
									type="checkbox" name="interest">&nbsp游戏 <input
									type="checkbox" name="interest">&nbsp科技 <input
									type="checkbox" name="interest">&nbsp旅游<br> <input
									type="checkbox" name="interest" style="margin-top: 1em;">&nbsp文学
								<input type="checkbox" name="interest">&nbsp公益 <input
									type="checkbox" name="interest">&nbsp汽车 <input
									type="checkbox" name="interest">&nbsp时尚 <input
									type="checkbox" name="interest">&nbsp宠物<br>
								<p style="font-size: 0.8em; color: gray; margin-top: 1em;">选择你的兴趣使你获得个性化的电影推荐哦</p>
							</div>
							<div class="clearfix"></div>
						</div> -->
						<div style="margin-top: 1.5em; margin-left: 1.5em;">
							<p>
								<span>个性签名：</span>&nbsp<input type="text" placeholder="20个字以内"
									style="width: 50%; font-size: 0.8em; height: 2.3em;"
									id="message">
							</p>
						</div>
						<div
							style="margin-top: 1.5em; margin-left: 1.5em; text-align: center; margin-bottom: 10em;">
							<button type="button" class="btn btn-danger" onclick="updateUser()">保存修改</button>
						</div>
					</div>
				</div>
				<div class="grids_of_4" id="orderInfo" style="display: none;">
					<!-- <div class="order-box" data-orderid="21359178002">
						<div class="order-header">
							<span class="order-date">2019-09-20</span>猫眼订单号:<span class="order-id">21359178002</span>
							<span class="del-order" data-orderid="21359178002"></span>
						</div>

						<div class="order-body">
							<div class="poster">
								<img src="">
							</div>

							<div class="order-content">
								<div class="movie-name">《罗小黑战记》</div>
								<div class="cinema-name">承光国际影城</div>
								<div class="hall-ticket">
									<span>6号RealD激光厅（该厅支持送餐到座）</span> <span>8排3座</span> <span>8排4座</span>
								</div>
								<div class="show-time">今天 9月20日 19:00</div>
							</div>

							<div class="order-price">￥72</div>

							<div class="order-status">待支付</div>

							<div class="actions">
								<div>
									<a href="#" class="pay-btn" data-act="orders-pay-click"
										data-bid="b_d2ll8ybm">付款</a>
								</div>
							</div>
						</div>
					</div> -->
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
	</div>
	<!-- content -->
	<div id="page-black"></div>
	<div id="addBox" class="outer-black" style="font-size: 18px;">
		<div>
			<div style="float: left;">取票二维码：</div>
			<div style="float: right;"><a href="javascript:void(0)" onclick="closeAddBox()"><img alt="" src="images/close.png"></a></div>
			<div class="clearfix"></div>
		</div>
		<br>
		<div id="qrcode" style="padding-left: 111px;"></div>
		<br>
		<div>取票号：<span id="codeNum"></span></div>
		<br>
		<div>观影时间：<span id="watchTime"></span></div>
		<br>
		<div style="font-size: 16px;color: red;">温馨提示：请在观影时间前取票，过期无效！</div>
	</div>
	<!-- footer -->
	<div class="footer">
		<div class="container">
			<p>Copyright &copy; 2015.Company name All rights reserved.</p>
		</div>
	</div>
	<!-- footer -->

</body>
</html>
